<template>
  <el-card :body-style="{height:'100%'}" shadow="hover" style="height: 100%;">
    <div class="wordcloud" ref="wordcloudRef">

    </div>
  </el-card>
</template>

<script lang="ts" name="wordcloud" setup>
import "echarts-wordcloud";
import { useEcharts } from "@/hooks/useEcharts";
import {getOption} from './options'
const wordcloudRef = ref<HTMLHtmlElement | null>(null)

onMounted(() => {
  const {setOption} = useEcharts(wordcloudRef)
  setOption(getOption())
});
</script>

<style lang="less" scoped>
.wordcloud {
  width: 100%;
  height: 100%;
}
</style>
